<template>
	<view class="card">
		<image v-bind:src="card.titlePicUrl" class="logo"></image>
		<scroll-view scroll-x="true" enable-flex="true" class="scroll">
			<view class="item" v-for="(item,index) in card.itemList" :key="index">
				<image :src="item.listPicUrl" class="img"></image>
				<text class="title">{{item.name}}</text>
			</view>
			<view class="item">
			    <view class="cur">查看更多>></view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	
	export default{
		props:['card']
	}
</script>

<style lang="stylus">
.card
	width 100%
	.logo
		width 100%
		height 350rpx
	.scroll
		width 100%
		height 300rpx
		display flex
		.item
			width 200rpx
			height: 300rpx
			margin 0 20rpx
			.img
				width 200rpx
				height 200rpx
				border-radius: 40rpx
			.title
				display -webkit-box
				-webkit-box-orient vertical
				-webkit-line-clamp 2 
				text-overflow: ellipsis
				overflow hidden
				font-size: 24rpx
			.cur
				display: block
				width: 200rpx
				height: 300rpx
				text-align: center
				line-height: 300rpx
</style>
